import allScreen from "../assets/images/allScreen.png";
import down from "../assets/images/down.png";

//可视化工具箱
export const getToolbox = (
  isShowTool: boolean,
  isFullScreen: boolean,
  onFullScreen: () => void,
  titletext: string,
  top?: number,
  right?: number
) => {
  // console.log('🚀 ~ file: function.tsx:45 ~ isShowTool:', isShowTool);
  const data = {
    show: true,
    itemSize: 18,
    top: top || 10,
    right: right || 28,
    zlevel: 9,
    feature: {
      saveAsImage: {
        // 保存图片
        name: titletext,
        show: isShowTool,
        icon: "image://".concat(down),
        backgroundColor: "#000000",
      },
      myTool: {
        // 自定义工具 myTool
        show: isShowTool,
        title: isFullScreen ? "还原" : "全屏显示",
        icon: "image://".concat(allScreen), // 此处 图片路径前面必须加字符串  "image://"
        onclick: onFullScreen,
      },
    },
  };
  return data;
};

//获取随机的id
export const getId = () => Math.random().toString(36).slice(2);

// 请求全屏
export const requestFullScreen = (data: any) => {
  const dom = document.getElementById(data); // 绑定想要全屏的组件
  console.log("🚀 ~ requestFullScreen ~ dom:", dom);
  if (dom) {
    if (dom.requestFullscreen) {
      dom.requestFullscreen();
    } else {
      // @ts-ignore
      // eslint-disable-next-line no-lonely-if
      if (dom.mozRequestFullScreen) {
        // @ts-ignore
        dom.mozRequestFullScreen();
        // @ts-ignore
      } else if (dom.webkitRequestFullScreen) {
        // @ts-ignore
        dom.webkitRequestFullScreen();
      }
    }
  }
};

// 退出全屏
export const exitFullscreen = () => {
  const dom = document;
  console.log("🚀 ~ exitFullscreen ~ dom:", dom);
  if (dom) {
    // @ts-ignore
    if (dom.exitFullscreen) {
      // @ts-ignore
      dom.exitFullscreen();
      // @ts-ignore
    } else if (dom.mozCancelFullScreen) {
      // @ts-ignore
      dom.mozCancelFullScreen();
      // @ts-ignore
    } else if (dom.webkitCancelFullScreen) {
      // @ts-ignore
      dom.webkitCancelFullScreen();
    }
  }
};
